<!DOCTYPE html>
<!-- saved from url=(0026)https://abiaobai.cn/05Y0WM -->
<html>

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

	<title>张老师，生日快乐哦</title>
	<!--<base href="./html/BirthdayBlessing/">-->
	<base href=".">
	<link href="./style.css" type="text/css" rel="stylesheet">
	<script src="./jquery.js"></script>
	<script src="./garden.js"></script>
	<script src="./functions.js"></script>

	<style>
		.bb {
			font-size: 20px !important;
		}

		.content {
			font-size: 24px !important;
		}
	</style>
</head>

<body>
	<div id="mainDiv">
		<div id="content" style="width: 1150px; height: 625px; margin-top: 10px; margin-left: 184.5px;">
			<div id="code" style="margin-top: 72.5px;">
				<span class="comments content">敬爱的张老师:</span><br><br>
				<span
					class="comments content">在你生日到来之际，我将快乐的音符，作为礼物送给你。愿您拥有365个美丽的日子，衷心地祝福你，生日快乐！在此诚挚地献上我的三个祝愿：一愿你身体健康；二愿你幸福快乐；三愿你万事如意！</span><br><br>
				<span class="comments  content">送你一个生日蛋糕，祝你生日快乐！第一层，体贴！第二层，关怀！第三层，浪漫！第四层，温馨！中间夹层，甜蜜！祝你天天都有一份好心情！
				</span><br>
				<br><br>
				<span class="comments">
					<b class="bb">
						您的学生(朋友) Li ★ 张老师 </b>
				</span>



				_


				<img src="./bm.jpg" width="200px">

				<img src="./ce.jpg" width="200px">

			</div>

			<div id="loveHeart">

				<canvas id="garden" width="670" height="625"></canvas>

				<div id="words" style="position: absolute; top: 205px; left: 734.5px;">

					<div id="messages" style="display: block;">

						<img src="./zsr.png">

					</div>

					<div id="loveu" style="display: block;">

						<img src="./sr.png">

					</div>

				</div>

			</div>

		</div>

		<div id="copyright">

			<center>



				<a class="c-white fs-12 icon-play rotate" id="btn-play" href="javascript:void(0);"></a>

			</center>
		</div>


		<div style="display:none;">
			<audio src="http://music.163.com/song/media/outer/url?id=427610321.mp3" controls="" autoplay="autoplay"
				loop="loop" id="bgmusic" style="display:none"></audio>



			<script>
				(function () {
					function log(info) {
						console.log(info);
						// alert(info);
					}
					function forceSafariPlayAudio() {
						audioEl.load(); // iOS 9   还需要额外的 load 一下, 否则直接 play 无效
						audioEl.play(); // iOS 7/8 仅需要 play 一下
					}

					var audioEl = document.getElementById('bgmusic');

					audioEl.addEventListener('loadstart', function () {
						log('loadstart');
					}, false);
					audioEl.addEventListener('loadeddata', function () {
						log('loadeddata');
					}, false);
					audioEl.addEventListener('loadedmetadata', function () {
						log('loadedmetadata');
					}, false);
					audioEl.addEventListener('canplay', function () {
						log('canplay');
					}, false);
					audioEl.addEventListener('play', function () {
						log('play');
						// 当 audio 能够播放后, 移除这个事件
						window.removeEventListener('touchstart', forceSafariPlayAudio, false);
					}, false);
					audioEl.addEventListener('playing', function () {
						log('playing');
					}, false);
					audioEl.addEventListener('pause', function () {
						log('pause');
					}, false);

					// 由于 iOS Safari 限制不允许 audio autoplay, 必须用户主动交互(例如 click)后才能播放 audio,
					// 因此我们通过一个用户交互事件来主动 play 一下 audio.
					window.addEventListener('touchstart', forceSafariPlayAudio, false);

					audioEl.src = "http://music.163.com/song/media/outer/url?id=427610321.mp3";
				})();
			</script>

		</div>



	</div>



	<script type="text/javascript">

		var offsetX = $("#loveHeart").width() / 2;

		var offsetY = $("#loveHeart").height() / 2 - 55;

		var together = new Date();

		together.setHours(8);

		together.setMinutes(0);

		together.setSeconds(0);

		together.setMilliseconds(0);



		if (!document.createElement('canvas').getContext) {

			var msg = document.createElement("div");

			msg.id = "errorMsg";

			msg.innerHTML = "您的浏览器已经过时!请使用非IE浏览器进行预览";

			document.body.appendChild(msg);

			$("#code").css("display", "none")

			$("#copyright").css("position", "absolute");

			$("#copyright").css("bottom", "10px");

			document.execCommand("stop");

		} else {

			setTimeout(function () {

				startHeartAnimation();

			}, 5000);



			timeElapse(together);

			setInterval(function () {

				timeElapse(together);

			}, 500);



			adjustCodePosition();

			$("#code").typewriter();

		}

	</script>






</body>

</html>